<template>
	<view class="message">
		<view class="message_bar">
			<view class="message_search">
				<image class="search_img" src="../../static/image/search.png" mode=""></image>
				<input type="text" class="search_input main_color" value="" placeholder="搜索最新资讯"/>
			</view>
		</view>
		<view class="message_list">
			<MessageList :dataList="messageList"></MessageList>
		</view>
	</view>
</template>

<script>
	import MessageList from '../../components/MessageList/index.vue';
	export default {
		data() {
			return {
				/** 资讯列表 */
				messageList: [],
				page: 1,
			}
		},
		
		onLoad() {
			this.getMessageList();
		},
		
		components: { 
			MessageList // 消息列表
		},
		
		methods: {
			getMessageList() {
				let parameter = {
					page: this.page
				};
				this.$post(this.api.getMessageList, parameter, 'post', { token: uni.getStorageSync('token') }).then((res) => {
					console.log(res)
					this.messageList = res.data.list;
				}).catch((err) => {
					console.log(err)
				})
			}
		}
	}
</script>

<style lang="less" scoped>
.message {
	.message_bar {
		padding: 54rpx 26rpx 14rpx 26rpx;
		background-color: #D1A764;
		.message_search {
			position: relative;
			.search_input {
				height: 60rpx;
				font-size: 28rpx;
			    color: #979797;
				padding-left: 88rpx;
				box-sizing: border-box;
				border-radius: 30rpx;
				background-color: #fff;
				border: 1rpx solid #F4F5FA;
			}
			.search_img {
				width: 33rpx;
				height: 33rpx;
				position: absolute;
				left: 36rpx;
				top: 50%;
				transform: translateY(-50%);
			}
		}
	}
	.message_list {
		padding: 8rpx 40rpx 0 28rpx;
		border-bottom: 1rpx solid #E5E5E5;
	}
	.message_list:last-child {
		border: none;
	}
}
</style>
